/**
 * 说明
 *
 * 1、用法（<webc-dialog>{ slot }</webc-dialog>）
 *
 * 2、Slot 插槽
 *    |
 *    |- title   标题
 *    |- content 主体内容
 *    |- footer  底部操作框
 *
 * 3、Event Listener
 *    |
 *    |- closed 对话框关闭后
 *
 * 4、Element Bind Event
 *    |
 *    |- close 关闭图标按钮点击事件
 */

import { selfStyle, templateHTML } from './render';
import { AutonomousCustomElement } from '../class';

class CustElement extends AutonomousCustomElement {
    // ...
    static custEleTagName = 'webc-dialog';

    constructor() {
        super({
            selfStyle,
            templateHTML,
            className: 'webc-dialog',
            conversionTable: {
                cls: 'webc-dialog',
            },
            registerEvents: ['closed'],
        });

        this.proxyEvents();
    }

    /**
     * 代理全局设置的绑定事件，用于内部触发监听器
     *
     * 注意：在改写以下回调事件时，需要采用 AOP 方式改写，否则无法触发监听器
     */
    proxyEvents() {
        window._webcEvent.dialog = {
            close: () => {
                this.dispatchEvent(this.eventMap.closed);
            },
        };
    }
}

customElements.define(CustElement.custEleTagName, CustElement);
